<div class="al-modal-view">
  <div>
    <div class="al-modal-title">取消预约</div>
    <div class="al-modal-form-container">
      <ng-form name="modalForm" class="form-horizontal form-validation" role="form">
        <div class="form-group">
          <label class="col-sm-3 col-sm-offset-1 control-label">公寓名称</label>
          <div class="col-sm-5">
            <div class="form-control info-text">{{data.buzProductName}}</div>
          </div>
        </div>
        <div class="form-group">
          <label class="col-sm-3 col-sm-offset-1 control-label">预约人名称</label>
          <div class="col-sm-5">
            <div class="form-control info-text">{{data.userName}}</div>
          </div>
        </div>
        <div class="form-group">
          <label class="col-sm-3 col-sm-offset-1 control-label">预约人手机</label>
          <div class="col-sm-5">
            <div class="form-control info-text">{{data.userPhone}}</div>
          </div>
        </div>
        <div class="form-group">
          <label class="col-sm-3 col-sm-offset-1 control-label">取消原因<span class="attr-need">*</span></label>
          <div class="col-sm-5">
            <textarea rows="5" ng-model="data.remark" placeholder="填写取消原因" required
                      class="form-control"></textarea>
          </div>
        </div>
        <div class="form-group">
          <div class="col-sm-3"></div>
          <div class="col-sm-3">
            <button class="al-center btn btn-default" ng-click="cancel()">取消</button>
          </div>
          <div class="col-sm-3">
            <button class="al-center btn btn-warning" ng-disabled="modalForm.$invalid" ng-click="confirm()">确定</button>
          </div>
          <div class="col-sm-3"></div>
        </div>
      </ng-form>
    </div>
  </div>
</div>